<div style="width: 98%;margin-top: 1%;margin-left: 1%">
    <table id="table_data" class="table table-striped table-bordered table-hover" width="100%">
        <thead>
            <tr>
                {% for tab in tables %}
                    <td>{{ tab }}</td>
                {% endfor %}
            </tr>
        </thead>
        <tbody>
            {% if valus %}
                 {% for val in valus %}
                    <tr>
                        {% for va in val %}
                            <td>{{ va }}</td>
                        {% endfor %}
                    </tr>
                 {% endfor %}
            {% endif %}
        </tbody>
    </table>
</div>
<script>
    $(document).ready(table_order('table_data',0));
</script>